class Food {
  element: HTMLElement;

  constructor() {
    // 获取页面中的food元素并将其赋值给element
    this.element = document.querySelector('.food')!
  }

  // 获取食物x坐标的方法
  get X() {
    return this.element.offsetLeft
  }

  // 获取食物Y坐标的方法
  get Y() {
    return this.element.offsetTop
  }

  // 修改食物位置的方法
  change() {
    // 生成一个随机的位置
    // 食物的位置最小是0 最大是盒子宽度减去食物宽度290
    // 蛇移动一次就是一格,一格大小就是10,所以就要求食物的坐标必须是10的倍数
    let top = Math.round(Math.random() * 29) * 10
    let left = Math.round(Math.random() * 29) * 10

    this.element.style.left = top + 'px'
    this.element.style.top = left + 'px'
  }
}

export default Food;